<template>
    <van-card
        v-for="user in props.userList"
        :key="user.id"
        :desc="user.profile"
        :title="`${user.username}（${user.planetCode}）`"
        :thumb="user.avatarUrl"
    >
        <template #tags>
            <van-tag
                plain
                type="primary"
                v-for="tag in user.tags"
                :key="tag['id']"
                style="margin-right: 8px; margin-top: 8px"
            >
                {{ tag }}
            </van-tag>
        </template>
        <template #footer>
            <van-button size="mini">联系我</van-button>
        </template>
    </van-card>
</template>

<script setup lang="ts">
import type { UserType } from '../models/user'

interface UserListProps {
    userList: UserType[]
}

// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-expect-error
const props = withDefaults(defineProps<UserListProps>(), {
    // eslint-disable-next-line vue/require-valid-default-prop
    userList: []
})
</script>

<style scoped></style>
